<template>
  <div class="min-container">
    <div>
      <client-title title="热门行业解决方案" class="content-title" />
      <div class="work">
        <el-row :gutter="0">
          <el-col :span="24" :xs="24" :sm="24" :md="12" v-for="(i, index) in workData" class="item" :key="index">
            <el-image style="width: 100%; height: 175px" :src="i.url" fit="cover" />
          </el-col>
        </el-row>
      </div>
    </div>
    <div>
      <client-title title="解决方案" class="content-title" />
      <div>
        <soultionList />
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { ref } from "vue";
import ClientTitle from '@/components/client-title/client-title.vue'
import soultionList from './solutionList/soultionList.vue'
import { getAssetURL } from '@/utils/load_assets'
const workData = ref<any>([
  { url: getAssetURL('client/solution/1.png') },
  { url: getAssetURL('client/solution/2.png') },
  { url: getAssetURL('client/solution/3.png') },
  { url: getAssetURL('client/solution/4.png') }
])
</script>
<style lang="less" scoped>
.content-title {
  margin: 30px;
}

.work {
  .el-col:nth-child(2n-1) {
    margin-right: -20px;
    // margin-left: -20px;
  }

  .el-col:nth-child(2n) {
    // margin-right: -30px;
    margin-left: -20px;
  }
}
</style>
